import type { ProColumns } from '@/components/Pro/';
import { ProTable } from '@/components/Pro/';
import { riskControllerGetRiskList as getList } from '@/services/ess/diagnosisRisk';
import { useModel } from '@umijs/max';
import React from 'react';

type Props = {
  type: string;
  clusterCode: string;
};

const TableList: React.FC<Props> = ({ type, clusterCode }) => {
  const { initialState } = useModel('@@initialState') as any;
  const columns: ProColumns<API.FengguDataRes>[] = [
    {
      title: '序号',
      dataIndex: 'pageIndex',
      hideInSearch: true,
      width: 40,
    },
    {
      title: '风险节点',
      dataIndex: 'node',
      width: 100,
    },
    {
      title: '风险描述',
      dataIndex: 'desc',
      width: 150,
      render: (_, record) => <span dangerouslySetInnerHTML={{ __html: record.desc }}></span>,
    },
    {
      title: '预测后果',
      dataIndex: 'prediction',
      width: 150,
      render: (_, record) => <span dangerouslySetInnerHTML={{ __html: record.prediction }}></span>,
    },
    {
      title: '建议措施',
      dataIndex: 'suggest',
      width: 150,
      render: (_, record) => <span dangerouslySetInnerHTML={{ __html: record.suggest }}></span>,
    },
  ];
  return (
    <div>
      <ProTable<API.FengguDataRes, API.PageParams>
        rowKey="downId"
        search={false}
        fullScreenTableHeight={false}
        request={getList}
        params={{
          stationId: initialState?.stationId,
          type,
          clusterCode,
        }}
        columns={columns}
        pagination={{
          defaultPageSize: 5,
          pageSizeOptions: [5, 10, 20, 50, 100],
        }}
        destroyOnClose={true}
      />
    </div>
  );
};
export default TableList;
